// div{
// 	widows: 200px;
// 	height:100px;
// 	background-color: #536;
// 	border:1px solid #656;
// 	text-align:center;
// }

// $minWidth:320px;
// div{
// 	widows: $minWidth;
// 	height:$minWidth;
// 	background-color: #536;
// 	border:1px solid #656;
// 	text-align:center;
// }

// 2继承
// $width:100px;
// $mainColor:blue;
// .out_box{
// 	width: $width;
// 	background-color:$mainColor;
// 	height:$width;
// }

// .out_box1{
// 	@extend .out_box;
// 	background-color: antiquewhite;
// }


// 3.选择器
// 全局变量
// $width:200px;
// $mainColor:blue;
// .out_box{
// 	width: $width;
// 	background-color:$mainColor;
// 	height:$width;
// 	$innerColor:red !global;
// 	.inner_box{
// 		width: 100px;
// 		background-color:$innerColor;
// 		height:100px;
// 		$innerColor:red !global;
// 		&:hover{
// 			background-color:$mainColor;
// 			transition:all 0.7s;
// 		}
// 	}
// 	&_title{
// 		font_size:19px;
// 		color:white;
// 	}
// }

// .out_box1{
// 	@extend .out_box;
// 	background-color: antiquewhite;
// }


// 5等值运算符

// $count:1;
// $color1:blue;
// $color2:red;
// $width:100px;
// .out_box{
// 	width: $width;
// 	height:$width;
// 	@if $count != 1{
// 		background-color:$color1;
// 	}@else{
// 		background-color:$color2;
// 	}
	
// }

// 6关系运算符
// $count:1;
// $color1:blue;
// $color2:red;
// $width:100px;
// .out_box{
// 	width: $width;
// 	height:$width;
// 	@if $count >= 2{
// 		background-color:$color1;
// 	}@else{
// 		background-color:$color2;
// 	}
	
// }

// 7布尔运算符
// $b1:true;
// $b2:false;
// $count:1;
// $color1:blue;
// $color2:red;
// $width:100px;

// .out_box{
// 	width: $width;
// 	height:$width;
// 	@if $b1 and $b2 {
// 		background-color:$color1;
// 	}@else{
// 		background-color:$color2;
// 	}
	
// }

// .out_box{
// 	width: $width;
// 	height:$width;
// 	@if $b1 or $b2 {
// 		background-color:$color1;
// 	}@else{
// 		background-color:$color2;
// 	}
	
// }

// .out_box{
// 	width: $width;
// 	height:$width;
// 	@if $b1 not $b2 {
// 		background-color:$color1;
// 	}@else{
// 		background-color:$color2;
// 	}
	
// }

// 8.数字运算符
// $width:100px;
// .out_box{
// 	// width: $width + $width;
// 	width: $width - 20px;
// 	// height:(200px / 3);
// 	height:(200px % 3);
// 	background-color:$color1;
// }

// 9.字符串运算符
// $countent:'abc' + bcd;
// $countent:abc + 'bcd';

// .out_box{
// 	&:before{
// 		countent: $countent;
// 	}
// }

// 10.插值语句

// $width:100px;
// $val1:1;
// $className1:out_box;
// $className2:out_box2;
// $val2:color;
// .#{$className1}{
// 	width:$width;
// 	height:$width;
// 	background-#{$val2}:aqua;
// }
// .#{$className2}{
// 	@extend .#{$className1};
// 	background-#{val2}:#583d42;
// }

// 11.流程控制
.out_box{
	width: $width;
	height:$width;
	@if $b1 and $b2 {
		background-color:$color1;
	}@else{
		background-color:$color2;
	}
	
}



